<!DOCTYPE html>
<html class="x-admin-sm">

<head>
    <meta charset="UTF-8">
    <title>修改赛事</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">
    <script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <script src="../js/base.js"></script>
    <script src="../js/jquery.min.js"></script>
    <script src="../js/area.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style>
        .rotate {

            transform-origin: center center;

            transform: rotate(180deg);

            -webkit-transform: rotate(180deg);

            -moz-transform: rotate(180deg);

            -ms-transform: rotate(180deg);

            -o-transform: rotate(180deg);

            transition: transform 0.2s;
            -moz-transition: -moz-transform 0.2s;

            -moz-transition: -moz-transform 0.2s;

            -o-transition: -o-transform 0.2s;

            -ms-transition: -ms-transform 0.2s;

        }

        .rotate1 {

            transform-origin: center center;

            transform: rotate(0deg);
            -webkit-transform: rotate(0deg);

            -moz-transform: rotate(deg);

            -ms-transform: rotate(0deg);

            -o-transform: rotate(0deg);

            transition: transform 0.2s;

            -moz-transition: -moz-transform 0.2s;

            -moz-transition: -moz-transform 0.2s;

            -o-transition: -o-transform 0.2s;

            -ms-transition: -ms-transform 0.2s;

        }

        .title .pull-left {
            float: left;
            font-size: 18px;
            font-weight: 700;
            color: #b1b1b1;
            line-height: 42px;
        }

        .title .pull-left.active {
            color: #333;
            border-bottom: 1px solid #42abff;
        }

        .title .pull-left.active .num {
            font-size: 33px;
            color: #3385c6;
        }

        .title .pull-left .num {
            font-size: 33px;
        }

        .chooseType div,
        .chooseType input {
            margin-top: 0;
            margin-right: 0;
            line-height: 50px;
        }

        .nextStep {
            margin: 0 auto;
        }

        .layui-card .layui-card-body {
            font-size: 14px;
        }

        .layui-card .layui-card-body .layui-input {
            height: 35px;
            margin-bottom: 26px;
        }

        .layui-card .layui-card-body .layui-form-label {
            padding-left: 0;
            width: 115px;
        }

        .sstitle {
            border-bottom: 1px solid #333;
            overflow: hidden;
        }

        .ssbody {
            display: none;
            background: #efefef;
        }

        hr {
            margin-bottom: 25px;
        }
    </style>
</head>

<body>

    <div class="layui-fluid">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-md12">
                <div class="layui-card" style="display: flex;justify-content: space-between;">
                    <div class="layui-card-body ">
                        <div class="title">
                            <div class="topstep1 pull-left" style="margin-right:30px">
                                <span class="num">01</span>
                                <span>赛程安排</span>
                            </div>
                            <div class="pull-left" style="margin-right:30px">
                                <img src="../images/jiantou.jpg" alt="">
                            </div>
                            <div class="topstep2 pull-left active" style="margin-right:30px">
                                <span class="num">02</span>
                                <span>裁判安排</span>
                            </div>
                            <div class="pull-left" style="margin-right:30px">
                                <img src="../images/jiantou.jpg" alt="">
                            </div>
                            <div class="topstep2 pull-left">
                                <span class="num">03</span>
                                <span>赛事数据</span>
                            </div>
                            <div style="clear: both;"></div>
                        </div>
                    </div>
                </div>
                <form class="layui-form" action="">
                    <div class="midstep1">
                        <div class="layui-card" style="display: flex;justify-content: space-between;">
                            <div class="layui-card-body" style="width: 100%;">
                                <div style="background: #EFEFEF;margin-bottom: 20px;">裁判安排</div>
                                <div class="chooseType">
                                    <div class="layui-col-md12">
                                        <div class="layui-form-item layui-col-md10 layui-col-md-offset1 scapbody">
                                            <div class="layui-col-md12" style="line-height: 35px;">本赛事共<span
                                                    class="matchTotal"></span>场比赛
                                            </div>
                                            <div class="layui-col-md11 layui-col-md-offset1">

                                            </div>
                                        </div>
                                    </div>
                                    <div style="text-align: center;">
                                        <button type="button" class="layui-btn layui-btn-normal save" lay-submit
                                            lay-filter="submit">保存
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</body>
<script>
    var idval;

    function child(val) {
        idval = val;

        layui.use(['table', 'laydate'], function () {
            var table = layui.table;
            var form = layui.form;
            var laydate = layui.laydate;

            var index = layer.load(1); //添加laoding,0-2两种方式
            layer.close(index)
            var judges = [];
            $.ajax({
                url: getRecruitrefereeListByCompetitionId,
                type: "POST",
                // 设置的是请求参数
                data: {
                    competitionId: idval
                },
                // 用于设置响应体的类型 注意 跟 data 参数没关系！！！
                dataType: 'json',
                success: function (res) {
                    for (var i = 0; i < res.recruitrefereeList.length; i++) {
                        judges.push(
                            "<option value=\"" + res.recruitrefereeList[i].refereeId + "\">" +
                            res
                            .recruitrefereeList[i].name + "</option>"
                        )
                    }

                }
            })


            form.on('submit(submit)', function (data) {

                var refereeInfo = [],
                    refereeId

                for (var i = 0; i < $(".sstitle").length; i++) {
                    if ($("[id^=zhucaipan]").eq(i).val() == "" || $("[id^=zhucaipan]").eq(i).val() ==
                        null) {
                        layer.alert("请选择主裁判", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=zhulicaipanb]").eq(i).val() == "" || $("[id^=zhulicaipanb]").eq(
                            i).val() == null) {
                        layer.alert("请选择助理裁判1", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=zhulicaipanc]").eq(i).val() == "" || $("[id^=zhulicaipanc]").eq(
                            i).val() == null) {
                        layer.alert("请选择助理裁判2", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=disicaipan]").eq(i).val() == "" || $("[id^=disicaipan]").eq(i)
                        .val() == null) {
                        layer.alert("请选择第四裁判", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=sqxh]").eq(i).val() == "") {
                        layer.alert("请选择赛区协会", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=zcxdhjlb]").eq(i).val() == "") {
                        layer.alert("请选择主场校队或俱乐部", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=jdjd]").eq(i).val() == "") {
                        layer.alert("请输入接待酒店", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=jdlxfs]").eq(i).val() == "") {
                        layer.alert("请输入酒店联系方式", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=bxjd]").eq(i).val() == "") {
                        layer.alert("请输入备选酒店", {
                            title: "提示"
                        });
                        return false
                    } else if ($("[id^=bxlxfs]").eq(i).val() == "") {
                        layer.alert("请输入酒店联系方式", {
                            title: "提示"
                        });
                        return false
                    }
                    refereeId = $(".sstitle").eq(i).attr("data-id")
                    if (refereeId == null) {
                        refereeId = ""
                    }
                    refereeInfo.push({
                        competitionId: idval,
                        roundId: $(".sstitle").eq(i).attr("data-val"),
                        refereeId: refereeId,
                        primaryReferee: $("[id^=zhucaipan]").eq(i).val(),
                        assistantReferee1: $("[id^=zhulicaipanb]").eq(i).val(),
                        assistantReferee2: $("[id^=zhulicaipanc]").eq(i).val(),
                        fourthReferee: $("[id^=disicaipan]").eq(i).val(),
                        association: $("[id^=sqxh]").eq(i).val(),
                        homeClub: $("[id^=zcxdhjlb]").eq(i).val(),
                        receptionHotel: $("[id^=jdjd]").eq(i).val(),
                        receptionPhone: $("[id^=jdlxfs]").eq(i).val(),
                        alternativeHotel: $("[id^=bxjd]").eq(i).val(),
                        alternativePhone: $("[id^=bxlxfs]").eq(i).val()
                    })
                }
                console.log(refereeInfo)
                $.ajax({
                    url: addOrUpdateRefereeInfo,
                    type: "POST",
                    // 设置的是请求参数
                    data: {
                        competitionId: idval,
                        refereeInfo: JSON.stringify(refereeInfo),
                    },
                    // 用于设置响应体的类型 注意 跟 data 参数没关系！！！
                    dataType: 'json',
                    success: function (res) {
                        if (res.code == "200") {
                            layer.alert("编辑成功", {
                                title: "提示",
                                cancel: function () {
                                    parent.layui.table.reload(
                                        "testReload");
                                    parent.layer.closeAll()
                                }
                            }, function () {
                                parent.layui.table.reload("testReload");
                                parent.layer.closeAll()
                            });
                        } else {
                            layer.alert(res.msg, {
                                title: "提示"
                            })
                        }
                    }
                })
            });

            // 获取赛程信息
            $.ajax({
                url: findRoundByCompetitionId,
                type: "POST",
                // 设置的是请求参数
                data: {
                    competitionId: idval
                },
                // 用于设置响应体的类型 注意 跟 data 参数没关系！！！
                dataType: 'json',
                success: function (res) {
                    $(".matchTotal").text(res.roundList.length)
                    for (var i = 0; i < res.roundList.length; i++) {
                        var strVar = "";
                        strVar +=
                            "<div class=\"sstitle\" data-id=\"\"><div style=\"float: left;\">场次：" +
                            (i + 1) + "</div";
                        strVar += "<div class=\"sstitletext\" style=\"float: left;\">";
                        strVar += "&emsp;地点：<span>" + res.roundList[i].address +
                            "<\/span>&emsp;比赛时间：<span>" + res.roundList[i].dateTime;
                        strVar += "<\/span>&emsp;对战球队：<span>" + res.roundList[i].primaryTeam +
                            "<\/span>&nbsp;VS&nbsp;<span>" + res.roundList[i].assistantTeam +
                            "<\/span>";
                        strVar += "<\/div>";
                        strVar += "<i style=\"float: right;\"";
                        strVar += "class=\"layui-icon layui-icon-down rotate1\"><\/i>";
                        strVar += "<\/div>";
                        strVar += "<div class=\"ssbody\" style=\"padding-top: 20px;\">";
                        strVar += "<div class=\"layui-form-item\">";
                        strVar += "<label class=\"layui-form-label\">主裁判：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 130px;\">";
                        strVar += "<select name=\"zhucaipan" + i + "\" id=\"zhucaipan" + i + "\"";
                        strVar += "lay-filter=\"zhucaipan" + i + "\"><\/select>";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        strVar += "<div class=\"layui-form-item\">";
                        strVar += "<label class=\"layui-form-label\">助理裁判1：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 130px;\">";
                        strVar += "<select name=\"zhulicaipanb" + i + "\" id=\"zhulicaipanb" + i +
                            "\" ";
                        strVar += "lay-filter=\"zhulicaipanb" + i + "\"><\/select>";
                        strVar += "<\/div>";
                        strVar += "<label class=\"layui-form-label\">助理裁判2：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 130px;\">";
                        strVar += "<select name=\"zhulicaipanc" + i + "\" id=\"zhulicaipanc" + i +
                            "\"";
                        strVar += "lay-filter=\"zhulicaipanc" + i + "\"><\/select>";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        strVar += "<div class=\"layui-form-item\">";
                        strVar += "<label class=\"layui-form-label\">第四裁判：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 130px;\">";
                        strVar += "<select name=\"disicaipan" + i + "\" id=\"disicaipan" + i + "\"";
                        strVar += "lay-filter=\"disicaipan" + i + "\"><\/select>";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        strVar += "<hr>";
                        strVar += "<div class=\"layui-form-item\">";
                        strVar += "<label class=\"layui-form-label\">赛区协会：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 225px;\">";
                        strVar += "<input type=\"text\" name=\"sqxh" + i + "\" id=\"sqxh" + i +
                            "\" placeholder=\"请输入赛区协会\"";
                        strVar += "autocomplete=\"off\" class=\"layui-input\">";
                        strVar += "<\/div>";
                        strVar += "<label class=\"layui-form-label\"";
                        strVar += "style=\"width: 130px;text-align: center;\">主场校队或俱乐部：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 225px;\">";
                        strVar += "<input type=\"text\" name=\"zcxdhjlb" + i +
                            "\" id=\"zcxdhjlb" + i +
                            "\" placeholder=\"请输入主场校队或俱乐部\"";
                        strVar += "autocomplete=\"off\" class=\"layui-input\">";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        strVar += "<hr>";
                        strVar += "<div class=\"layui-form-item\">";
                        strVar += "<label class=\"layui-form-label\">接待酒店：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 225px;\">";
                        strVar += "<input type=\"text\" name=\"jdjd" + i + "\" id=\"jdjd" + i +
                            "\" placeholder=\"请输入接待酒店\"";
                        strVar += "autocomplete=\"off\" class=\"layui-input\">";
                        strVar += "<\/div>";
                        strVar += "<label class=\"layui-form-label\"";
                        strVar += "style=\"width: 130px;text-align: center;\">酒店联系方式：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 225px;\">";
                        strVar += "<input type=\"text\" name=\"jdlxfs" + i +
                            "\" id=\"jdlxfs" + i +
                            "\" placeholder=\"请输入联系方式\"";
                        strVar += "autocomplete=\"off\" class=\"layui-input\">";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        strVar += "<div class=\"layui-form-item\">";
                        strVar += "<label class=\"layui-form-label\">备选酒店：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 225px;\">";
                        strVar += "<input type=\"text\" name=\"bxjd" + i + "\" id=\"bxjd" + i +
                            "\" placeholder=\"请输入备选酒店\"";
                        strVar += "autocomplete=\"off\" class=\"layui-input\">";
                        strVar += "<\/div>";
                        strVar += "<label class=\"layui-form-label\"";
                        strVar += "style=\"width: 130px;text-align: center;\">酒店联系方式：<\/label>";
                        strVar += "<div class=\"layui-input-inline\" style=\"width: 225px;\">";
                        strVar += "<input type=\"text\" name=\"bxlxfs" + i +
                            "\" id=\"bxlxfs" + i +
                            "\" placeholder=\"请输入联系方式\"";
                        strVar += "autocomplete=\"off\" class=\"layui-input\">";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        strVar += "<\/div>";
                        $(".layui-col-md11.layui-col-md-offset1").append(strVar);
                        $(".sstitle").eq(i).attr("data-val", res.roundList[i].id)
                        $(".sstitle").eq(i).attr("data-id", res.roundList[i].refereeId)
                        for (var j = 0; j < judges.length; j++) {
                            $("#zhucaipan" + i).append(judges[j]);
                            $("#zhulicaipanb" + i).append(judges[j])
                            $("#zhulicaipanc" + i).append(judges[j])
                            $("#disicaipan" + i).append(judges[j])

                        }
                        $("#zhucaipan" + i).val(res.roundList[i].primaryReferee);
                        $("#zhulicaipanb" + i).val(res.roundList[i].assistantReferee1)
                        $("#zhulicaipanc" + i).val(res.roundList[i].assistantReferee2)
                        $("#disicaipan" + i).val(res.roundList[i].fourthReferee)
                        $("#jdjd" + i).val(res.roundList[i].primaryHotel);
                        $("#jdlxfs" + i).val(res.roundList[i].primaryPhone);
                        $("#bxjd" + i).val(res.roundList[i].assistantHotel);
                        $("#bxlxfs" + i).val(res.roundList[i].assistantPhone);
                        $("#sqxh" + i).val(res.roundList[i].association);
                        $("#zcxdhjlb" + i).val(res.roundList[i].homeClub);
                        form.render();
                    }

                }
            })

        })
        $("body").on("click", ".sstitle", function () {
            $(".ssbody").stop(true, false);
            if ($(this).children(".layui-icon.layui-icon-down").hasClass("rotate") && !$(this).children(
                    ".layui-icon.layui-icon-down").hasClass("rotate1")) {
                $(this).children(".layui-icon.layui-icon-down").removeClass("rotate").addClass("rotate1");
                $(this).next().slideUp()
            } else if ($(this).children(".layui-icon.layui-icon-down").hasClass("rotate1") && !$(this).children(
                    ".layui-icon.layui-icon-down").hasClass("rotate")) {
                $(this).children(".layui-icon.layui-icon-down").removeClass("rotate1").addClass("rotate");
                $(this).next().slideDown()
            }
        })
    }
</script>

</html>